<!DOCTYPE html>
<html>
	<head>
		<meta name="referrer" content="no-referrer"/>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/tabdemo.css"/>
		<script src="js/jquery-3.5.1.min.js"></script>
		<style type="text/css">
			img{
				width: 160px;
				height: 180px;
			}
		</style>
	</head>
	<body>
		<div class="tabox">
			<!--179000629徐阳光-->
		      <div class="hd">
		        <ul>
		          <li class="on">正在热映</li>
		          <li class="">即将热映</li>
		          <li class="">Top250</li>
		          <li class="">最新上映</li>
		          <li class="">豆瓣高分</li>
				  </ul>
		      </div>
			  
		      <div class="bd">
				  
		        <ul class="lh" style="text-align: center;">
		          <li>
					  <input type="text" id="in1" style="width: 70px;">
					  <input type="button" value="点击查询" id="btn1"><br>
					  <span id="span1"></span><br>
				  </li>
		          <li>
					  <input type="text" id="in2" style="width: 70px;">
					  <input type="button" value="点击查询" id="btn2"><br>
					  <span id="span2"></span><br>
				  </li>
		          <li>
					  <input type="text" id="in3" style="width: 70px;">
					  <input type="button" value="点击查询" id="btn3"><br>
					  <span id="span3"></span><br>
				  </li>
		          <li>
					  <input type="text" id="in4" style="width: 70px;">
					  <input type="button" value="点击查询" id="btn4"><br>
					  <span id="span4"></span><br>
				  </li>
		          <li>
					  <input type="text" id="in5" style="width: 70px;">
					  <input type="button" value="点击查询" id="btn5"><br>
					  <span id="span5"></span><br>
				  </li>
		        </ul>
				
		      </div>
		    </div>
			<script>
				$(function(){
					$("#btn1").click(function(){
						var i = $("#in1").val();//获取输入框的值
						// console.log(i);
						$.ajax({
							type:"GET",
							url:"https://douban.uieee.com/v2/movie/in_theaters",
							data:{average:$("#average").val(),title:$("#title").val()},
							dataType:"jsonp",
							success:function(data){
								console.log(data);
								var str = "";
								str+="<p>"+data.subjects[i].title+"</p>";
								str +="<ul>";
								str+="<img src='"+data.subjects[i].images.small+"'/><br>"
								str +="<ul/>";
								$("#span1").html(str);
							},
							beforeSend:function(){
								var loading = $('<input type="text" value="请稍后，数据正在加载中..." style="border: 0;"/>');
								$("#span1").append(loading);
							}
						});
					})
					
					$("#btn2").click(function(){
						var i = $("#in2").val();//获取输入框的值
						// console.log(i);
						$.ajax({
							type:"GET",
							url:"https://douban.uieee.com/v2/movie/coming_soon",
							data:{average:$("#average").val(),title:$("#title").val()},
							dataType:"jsonp",
							success:function(data){
								var str = "";
								str+="<p>"+data.subjects[i].title+"</p>";
								str +="<ul>";
								str+="<img src='"+data.subjects[i].images.small+"'/><br>"
								str +="<ul/>";
								$("#span2").html(str);
							},
							beforeSend:function(){
								var loading = $('<input type="text" value="请稍后，数据正在加载中..." style="border: 0;"/>');
								$("#span2").append(loading);
							}
						});
					})
					
					$("#btn3").click(function(){
						var i = $("#in3").val();//获取输入框的值
						// console.log(i);
						$.ajax({
							type:"GET",
							url:"https://douban.uieee.com/v2/movie/top250",
							data:{average:$("#average").val(),title:$("#title").val()},
							dataType:"jsonp",
							success:function(data){
								var str = "";
								str+="<p>"+data.subjects[i].title+"</p>";
								str +="<ul>";
								str+="<img src='"+data.subjects[i].images.small+"'/><br>"
								str +="<ul/>";
								$("#span3").html(str);
							},
							beforeSend:function(){
								var loading = $('<input type="text" value="请稍后，数据正在加载中..." style="border: 0;"/>');
								$("#span3").append(loading);
							}
						});
					})
					$("#btn4").click(function(){
						var i = $("#in3").val();//获取输入框的值
						// console.log(i);
						$.ajax({
							type:"GET",
							url:"https://douban.uieee.com/v2/movie/top250",
							data:{average:$("#average").val(),title:$("#title").val()},
							dataType:"jsonp",
							success:function(data){
								var str = "";
								str+="<p>"+data.subjects[i].title+"</p>";
								str +="<ul>";
								str+="<img src='"+data.subjects[i].images.small+"'/><br>"
								str +="<ul/>";
								$("#span4").html(str);
							},
							beforeSend:function(){
								var loading = $('<input type="text" value="请稍后，数据正在加载中..." style="border: 0;"/>');
								$("#span4").append(loading);
							}
						});
					})
					$("#btn5").click(function(){
						var i = $("#in3").val();//获取输入框的值
						// console.log(i);
						$.ajax({
							type:"GET",
							url:"https://douban.uieee.com/v2/movie/top250",
							data:{average:$("#average").val(),title:$("#title").val()},
							dataType:"jsonp",
							success:function(data){
								var str = "";
								str+="<p>"+data.subjects[i].title+"</p>";
								str +="<ul>";
								str+="<img src='"+data.subjects[i].images.small+"'/><br>"
								str +="<ul/>";
								$("#span5").html(str);
							},
							beforeSend:function(){
								var loading = $('<input type="text" value="请稍后，数据正在加载中..." style="border: 0;"/>');
								$("#span5").append(loading);
							}
						});
					})
					
				});
			</script>
			<script src="js/jquery_dh.js"></script>
	</body>
</html>
